<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <title>Easy Layui Admin后台管理</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="plugin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="css/style.css">
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="plugin/layui/layui.js"></script>
</head>

<body>
  <div class="admin-content-box-nav">
    <span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility:visible;">
      <a href="javascript:;">首页</a><span lay-separator="">/</span>
      <a href="javascript:;">文章管理</a><span lay-separator="">/</span>
      <a><cite>文章列表</cite></a>
    </span>
  </div>

  <div class="layui-row" style="padding:15px;border-bottom:1px solid #f6f6f6;">
    <form class="layui-form layui-col-md12">
      文章搜索：
      <div class="layui-input-inline">
        <select name="cateid">
          <option>请选择分类</option>
          <option>文章</option>
          <option>会员</option>
          <option>权限</option>
        </select>
        <div class="layui-unselect layui-form-select">
          <div class="layui-select-title"><input type="text" placeholder="请选择" value="请选择分类" readonly=""
              class="layui-input layui-unselect"><i class="layui-edge"></i></div>
          <dl class="layui-anim layui-anim-upbit">
            <dd lay-value="请选择分类" class="layui-this">请选择分类</dd>
            <dd lay-value="文章" class="">文章</dd>
            <dd lay-value="会员" class="">会员</dd>
            <dd lay-value="权限" class="">权限</dd>
          </dl>
        </div>
      </div>
      <div class="layui-inline">
        <input class="layui-input" placeholder="开始日期" name="start" id="start-date">
      </div>
      <div class="layui-inline">
        <input class="layui-input" placeholder="截止日期" name="end" id="end-date">
      </div>
      <div class="layui-inline">
        <input type="text" name="keyword" placeholder="请输入关键字" autocomplete="off" class="layui-input">
      </div>
      <button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon layui-icon-search"></i></button>
    </form>
  </div>

  <div class="layui-fluid">
    <div style="padding-top:15px;padding-bottom:5px;">
      <button class="layui-btn layui-btn-danger" data-type="getCheckData"><i
          class="layui-icon layui-icon-delete"></i>批量删除</button>
      <button class="layui-btn" data-type="Recommend"><i class="layui-icon layui-icon-praise"></i>推荐</button>
      <button class="layui-btn" data-type="Top"><i class="layui-icon layui-icon-up"></i>置顶</button>
      <button class="layui-btn" data-type="Review"><i class="layui-icon layui-icon-survey"></i>审核</button>
      <button class="layui-btn"><i class="layui-icon layui-icon-add-circle"></i>添加</button>
      <span class="fr" style="line-height:40px">共有数据：88 条</span>
    </div>

    <div class="layui-form">
      <table class="layui-table">
        <colgroup>
          <col width="60">
          <col>
          <col>
          <col>
          <col>
          <col width="120">
          <col width="120">
          <col width="120">
          <col width="240">
        </colgroup>
        <thead>
          <tr>
            <th>ID</th>
            <th>人物</th>
            <th>民族</th>
            <th>出场时间</th>
            <th>格言</th>
            <th>推荐</th>
            <th>置顶</th>
            <th>审核</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>1</td>
            <td>贤心</td>
            <td>汉族</td>
            <td>1989-10-14</td>
            <td>人生似修行</td>
            <td>
              <input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已推荐|未推荐">
            </td>
            <td><input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已置顶|未置顶"></td>
            <td><input type="checkbox" name="like[read]" title="审核"></td>
            <td><a href="article-edit.html" class="layui-btn layui-btn-normal layui-btn-xs"><i
                  class="layui-icon layui-icon-edit"></i></a> <a class="layui-btn layui-btn-danger layui-btn-xs"
                onclick="del_article('123')"><i class="layui-icon layui-icon-delete"></i></a></td>
          </tr>
          <tr>
            <td>2</td>
            <td>张爱玲</td>
            <td>汉族</td>
            <td>1920-09-30</td>
            <td>于千万人之中遇见你所遇见的人，于千万年之中，时间的无涯的荒野里…</td>
            <td>
              <input type="checkbox" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="已推荐|未推荐">
            </td>
            <td><input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已置顶|未置顶"></td>
            <td><input type="checkbox" name="like[read]" title="审核" checked=""></td>
            <td><a href="article-edit.html" class="layui-btn layui-btn-normal layui-btn-xs"><i
                  class="layui-icon layui-icon-edit"></i></a> <a class="layui-btn layui-btn-danger layui-btn-xs"
                onclick="del_article('123')"><i class="layui-icon layui-icon-delete"></i></a></td>
          </tr>
          <tr>
            <td>3</td>
            <td>Helen Keller</td>
            <td>拉丁美裔</td>
            <td>1880-06-27</td>
            <td> Life is either a daring adventure or nothing.</td>
            <td>
              <input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已推荐|未推荐">
            </td>
            <td><input type="checkbox" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="已置顶|未置顶"></td>
            <td><input type="checkbox" name="like[read]" title="审核" checked="false"></td>
            <td><a href="article-edit.html" class="layui-btn layui-btn-normal layui-btn-xs"><i
                  class="layui-icon layui-icon-edit"></i></a> <a class="layui-btn layui-btn-danger layui-btn-xs"
                onclick="del_article('123')"><i class="layui-icon layui-icon-delete"></i></a></td>
          </tr>
          <tr>
            <td>4</td>
            <td>岳飞</td>
            <td>汉族</td>
            <td>1103-北宋崇宁二年</td>
            <td>教科书再滥改，也抹不去“民族英雄”的事实</td>
            <td>
              <input type="checkbox" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="已推荐|未推荐">
            </td>
            <td><input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已置顶|未置顶"></td>
            <td><input type="checkbox" name="like[read]" title="审核"></td>
            <td><a href="article-edit.html" class="layui-btn layui-btn-normal layui-btn-xs"><i
                  class="layui-icon layui-icon-edit"></i></a> <a class="layui-btn layui-btn-danger layui-btn-xs"
                onclick="del_article('123')"><i class="layui-icon layui-icon-delete"></i></a></td>
          </tr>
          <tr>
            <td>5</td>
            <td>孟子</td>
            <td>华夏族（汉族）</td>
            <td>公元前-372年</td>
            <td>猿强，则国强。国强，则猿更强！ </td>
            <td>
              <input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest"
                lay-text="已推荐|未推荐">
            </td>
            <td><input type="checkbox" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="已置顶|未置顶"></td>
            <td><input type="checkbox" name="like[read]" title="审核" checked=""></td>
            <td><a href="article-edit.html" class="layui-btn layui-btn-normal layui-btn-xs"><i
                  class="layui-icon layui-icon-edit"></i></a> <a class="layui-btn layui-btn-danger layui-btn-xs"
                onclick="del_article('123')"><i class="layui-icon layui-icon-delete"></i></a></td>
          </tr>
        </tbody>
      </table>
      <div class="layui-box layui-laypage layui-laypage-default"><a href="javascript:;"
          class="layui-laypage-prev layui-disabled" data-page="0"><i class="layui-icon layui-icon-prev"></i></a><span
          class="layui-laypage-curr"><em class="layui-laypage-em"></em><em>1</em></span><a href="javascript:;"
          data-page="2">2</a><a href="javascript:;" data-page="3">3</a><a href="javascript:;" class="layui-laypage-last"
          title="尾页" data-page="4">4</a><a href="javascript:;" class="layui-laypage-next" data-page="2"><i
            class="layui-icon layui-icon-next"></i></a><span class="layui-laypage-count">共 100 条</span>
      </div>
    </div>
  </div>
  <script>
    layui.use(['laydate', 'jquery', 'form'], function () {
      var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
      //……
      //但是，如果你的HTML是动态生成的，自动渲染就会失效
      //因此你需要在相应的地方，执行下述方法来手动渲染，跟这类似的还有 element.init();
      form.render();

      var laydate = layui.laydate;
      //执行laydate实例
      //常规用法
      laydate.render({
        elem: '#start-date'
      });
      laydate.render({
        elem: '#end-date'
      });
    });

    //删除文章
    function del_article(id) {
      //询问框
      layer.confirm('确认要删除吗？', {
        btn: ['确定', '取消'] //按钮
      }, function () {
        layer.msg('操作成功', { time: 1000 });
      }, function () {

      });
    }
  </script>
</body>

</html>